<template>
  <div id="videocontent">
    <div class="head-top">
      <mt-header :title="dataList.videoName||dataList.name||dataList.title">
        <mt-button icon="back" slot="left" @click='back'></mt-button>
        <mt-button slot="right" @click="toggle">
          <img src="../../../../../../static/book/book09.png" alt="" width="30px" height="30px" v-if="CollectNo.whetherCollection == 1" />
          <img src="../../../../../../static/book/book08.png" alt="" width="30px" height="30px" v-else/>
        </mt-button>
      </mt-header>
    </div>
    <div class="video">
      <iframe :src="dataList.previewUrl||dataList.describ" frameborder="0" width="100%"></iframe>
    </div>
  </div>
</template>

<script>
import baseurl from "../../../../../api/baseurl.js";
import { Toast } from "mint-ui";
export default {
  data() {
    return {
      dataList: {},
      active: true,
      CollectNo: []
    };
  },
  created() {
    this.dataList = this.$route.params.videodata;
    console.log(this.$route.params.videodata);
    this.isCollect();
    this.readRecord();
  },
  methods: {
    // 行为记录
    readRecord() {
      const userid = localStorage.getItem("userid");
      const accid = localStorage.getItem("accid");
      const params = new URLSearchParams();
      params.append("title", this.dataList.videoName || this.dataList.title);
      params.append("type", 3);
      params.append("userid", userid);
      params.append("fileid", this.dataList.videoId || this.dataList.fileid);
      params.append("recorddate", "");
      params.append(
        "describ",
        this.dataList.previewUrl || this.dataList.describ
      );
      params.append("imgurl", this.dataList.videoCover || this.dataList.cover);
      params.append("author", "");
      params.append("edition", accid);
      this.$http({
        method: "post",
        url: baseurl.urls + "readrecord/addReadrecord",
        data: params
      })
        .then(response => {
          console.log(response);
        })
        .catch(error => {
          console.log(error);
        });
    },
    toggle() {
      if (this.CollectNo.whetherCollection == 1) {
        this.delCollect();
      } else {
        this.addCollect();
      }
    },
    // 删除收藏
    delCollect() {
      const userid = localStorage.getItem("userid");
      this.$http({
        method: "post",
        url: baseurl.urls + "/collection/deleteCollection",
        params: {
          id: this.CollectNo.collectionId
        }
      })
        .then(response => {
          if (response.status == 200) {
            Toast("删除成功");
            this.isCollect();
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    // 查询图书记录
    isCollect() {
      const userid = localStorage.getItem("userid");
      const accid = localStorage.getItem("accid");
      this.$http({
        method: "post",
        url: baseurl.urls + "readrecord/selectBookMessage",
        params: {
          columnType: 3,
          type: 1,
          userid: userid,
          fileid: this.dataList.videoId || this.dataList.fileId,
          edition: accid
        }
      })
        .then(response => {
          this.CollectNo = response.data.date;
          console.log(this.CollectNo);
        })
        .catch(error => {
          console.log(error);
        });
    },
    addCollect() {
      const userid = localStorage.getItem("userid");
      const params = new URLSearchParams();
      params.append("userid", userid);
      //收藏类型 例如：1 图书 2悦读 3 视听 4 报纸 5 期刊 ...
      params.append("columntype", 3);
      //封面
      params.append("cover", this.dataList.cover || this.dataList.videoCover);
      //名称
      params.append("name", this.dataList.videoName || this.dataList.name);
      //类型 1 图书 2 期刊  3 报纸  ....
      params.append("type", 1);
      //描述
      params.append(
        "describe",
        this.dataList.previewUrl || this.dataList.describ
      );
      //播放数量
      params.append("playback", "");
      //fileid 唯一值不能重复
      params.append("fileid", this.dataList.videoId || this.dataList.fileId);
      this.$http({
        method: "post",
        url: baseurl.urls + "collection/addCollection",
        data: params
      })
        .then(response => {
          if (response.status == 200) {
            this.isCollect();
            Toast("收藏成功");
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    back() {
      this.$router.back();
    }
  }
};
</script>

<style scoped>
#videocontent .video {
  height: 100vh;
  width: 100%;
  overflow:scroll;  
  background-color: #ffffff;
}
.video iframe {
  width: 100%;
  height: 90vh;
}
.title {
  background-color: #ffffff;
  margin-top: 17px;
  padding: 0 15px;
}
.title .subtitl {
  font: 15px/22px "microsoft yahei";
  font-weight: 600;
  padding-top: 10px;
}
.title .paly {
  display: flex;
  justify-content: space-between;
  color: #a1a1a1;
  margin: 15px 0;
  padding-bottom: 30px;
}
</style>